<script setup>
import {ref, defineExpose} from 'vue'
import {queryUserTokenNum} from "@/api/user.js";

const tokenNum = ref(0)

const getUserTokenNum = () => {
  queryUserTokenNum()
    .then((res) => {
      if (res.data.code === 1) {
        tokenNum.value = Number(res.data.data)
      }
    })
    .catch((err) => {
      console.log(err)
    })
}
getUserTokenNum()

// 暴露方法和 tokenNum 给父组件
defineExpose({
  getUserTokenNum,
  tokenNum
})
</script>

<template>
  <div class="token-num">
    <a-tooltip content="用于AI功能的产出消耗，当tokens不足时，将无法使用AI功能">
      <a-statistic :value="tokenNum" start animation show-group-separator format="0">
        <template #prefix>
          我的tokens:
        </template>
      </a-statistic>
    </a-tooltip>
  </div>
</template>

<style scoped>

</style>
